<!DOCTYPE html> 
<html> 
<head> 
	<meta charset="utf-8"> 
	<meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1">
	<title>PLAYER!</title> 
	<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.css" />
	<link rel="stylesheet" href="./css/custom.css" />
	<script src="http://code.jquery.com/jquery-1.6.1.min.js"></script>
	<script src="./js/init.js"></script>
	<script src="http://code.jquery.com/mobile/1.0b1/jquery.mobile-1.0b1.min.js"></script>
	<script src="./js/custom.js"></script>
</head> 
<body> 

<script>
$('#home').live('pagebeforecreate',function(event){
	if (typeof(localStorage) == 'undefined') {
		alert('Your browser does not support HTML5 localStorage. Try upgrading.');
		//FIXME Exit
	} else if (!isPlayerCached()) {
		$("<a href='signup.html' data-rel='dialog'></a>").click().remove();
	}
});
</script>

<div data-role="page" data-title="Player" id="home"> <!-- page's id must match navbar's href -->
 
  <div data-role="header" data-position="fixed">
    <h1>Home</h1>
  </div>
 
  <div data-role="content"> 
    <!-- FIXME: highlight "profile" header group -->
    <!-- FIXME: add content for home screen -->
    Hier fehlt Inhalt!  
  </div>
  
  <div data-role="footer" data-id="playerfooter" data-position="fixed"> 
    <div data-role="navbar"> <!-- navbar's hrefs must match to pages' id -->
    	<ul>
    		<!-- FIXME: use glyphisch icons or something else ? -->
    		<li><a href="#home" data-icon="home" class="ui-btn-active ui-state-persist">Home</a></li>
    		<li><a href="gameactions.html" data-icon="gear">Games</a></li>
    		<li><a href="rankings.html" data-icon="gear">Ranks</a></li>
    	</ul>
    </div>
  </div>
 
</div>

</body>
</html>